import { createI18n, type I18nOptions } from 'vue-i18n'
import { getCurrentInstance } from 'vue'
//@ts-ignore
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
//@ts-ignore
import en from 'element-plus/dist/locale/en.mjs'
import dayjs from 'dayjs' // elementplus中的日期组件的多语言文件
import 'dayjs/locale/zh-cn'
import 'dayjs/locale/en'

import type { App, Ref } from 'vue'
import { l as zh_cn } from '@/assets/i18n/zh-cn.ts'
import { l as en_us } from '@/assets/i18n/en.ts'

// 创建 i18n 实例
// 明确指定 messages 的类型。避免调用i18n.global.t时提示“类型实例化过深，且可能无限”
const messages: I18nOptions['messages'] = {
  'zh-cn': { ...zhCn.el, l: { ...zh_cn } },
  'en': { ...en.el, l: { ...en_us } }
}
const i18n = createI18n({
  legacy: false,
  locale: 'zh-cn',
  fallbackLocale: 'zh-cn', // 回退语言
  messages
})

export function setupI18n(app: App) {
  // 注册 i18n
  app.use(i18n)
  // 提供响应式语言配置
  app.provide('el-locale', zhCn)

  // app.config.globalProperties.$t = i18n.global.t
  app.config.globalProperties.$locale = i18n.global.locale
}

// 动态切换语言
export function setLocaleLanguage(lang: 'zh-cn' | 'en') {
  const locale = lang === 'zh-cn' ? zhCn : en
  i18n.global.locale.value = lang
  dayjs.locale(lang)
  // 更新 Element Plus 语言
  const app = getCurrentInstance()?.appContext.app
  if (app) {
    app.provide('el-locale', locale)
  }
}

export default i18n
